<template>
    <div class="xiangguanhaowu">
        <div class="xiangguan-top">
    		<span class="xiangguan-left"><img src="../assets/img/top-left.png"></span>
    		<span class="xiangguan-center">相关好物</span>
    		<span class="xiangguan-right"></span>
    	</div>
		<div class="xiangguan-box">
			<div class="xiangguan-warp">
				<ul>
					<li class="left">
						<div  v-for="test in infos">
							<img v-bind:src="test.imgs">
							<p>{{test.text}}<span>{{test.text1}}</span></p>
						</div> 
					</li>
					<li class="right">
						<div  v-for="test in listinfos">
							<img v-bind:src="test.imgs">
						    <p>{{test.text}}<span>{{test.text1}}</span></p>
						</div>
					</li>
				</ul>
			</div>
		</div>
    </div>
</template>

<script>
export default {
  name: 'xiangguanhaowu',
  data () {
    return {
    	infos:[
    		{
	    		imgs:"../static/img/xiangguan-logo1.png",
	    		text:"下水道过滤网",
	    		text1:"￥5.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo2.png",
	    		text:"下水道过滤网",
	    		text1:"￥59.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo3.png",
	    		text:"下水道过滤网",
	    		text1:"￥5.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo4.png",
	    		text:"下水道过滤网",
	    		text1:"￥59.00"
    		}
    	],
    	listinfos:[
    		{
	    		imgs:"../static/img/xiangguan-logo4.png",
	    		text:"下水道过滤网",
	    		text1:"￥5.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo3.png",
	    		text:"下水道过滤网",
	    		text1:"￥59.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo2.png",
	    		text:"下水道过滤网",
	    		text1:"￥5.00"
    		},
    		{
	    		imgs:"../static/img/xiangguan-logo1.png",
	    		text:"下水道过滤网",
	    		text1:"￥59.00"
    		}
    	]
    }
  }
}
</script>


<style scoped lang="less">
 @import url(../assets/less/xiangguanhaowu.less);
</style>